<!DOCTYPE html>
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <title>Dr. Oetker Canada Data Collection</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width">
        <link href="img/logo.ico" rel="shortcut icon" />
        <script src="js/globals.js"></script>
        <script src="js/CSSLoader.js"></script>
        <script src="js/JSLoader.js"></script>
    </head>
    <body>
        <div class="header">
            <h1>Dr. Oetker Canada Data Collection</h1>
            <div id="currentUser">User: Some User</div>
            <button class="clearfix"style="float:left;margin-left: 10px;" id="logout" >Logout</button>
            <img class="logo" src="img/logo.gif" alt="logo"/>

        </div>
        <div class="topmenu">
            <ul class="clearfix">
                <li data-where="10" id="menu1">Mixers</li>
                <li data-where="20" id="menu2">Packaging</li>
                <li data-where="30" id="menu3">Silos</li>
                <li data-where="40" id="menu4">Activities</li>
                <li data-where="50" id="menu5">Events</li>
                <li data-where="60" id="menu6">Settings</li>
            </ul>
        </div>
        <div id="tabItems" class="tabs clearfix">
            <div class='tab active'>Tab</div>
       </div>
        <div class="main-wrapper clearfix">
            <div class="state-wrapper clearfix" id="states_holder">
                <div class="ui-layout-north">North</div>
                <div class="ui-layout-center">Center</div>
                <div class="ui-layout-south">South</div>
                <div class="ui-layout-east">East</div>
                <div class="ui-layout-west">West</div>
            </div>
        </div>
        <div class="status-message">Status message</div>
    </body>
</html>
